import type { AgentList, BindListResp } from '#/api/agent/model/bindModel';

import { computed } from 'vue';

import { $t } from '@vben/locales';

export const tablecolumns = computed(() => [
  {
    title: $t('customer.bind.userId'),
    field: 'userId',
  },
  {
    title: $t('customer.bind.username'),
    field: 'username',
    treeNode: true,
  },
  {
    title: $t('customer.bind.bindagent'),
    field: 'agentList',
    slots: {
      default: ({ row }: { row: BindListResp }) => {
        return (
          <div>
            {row?.agentList?.map((item: AgentList) => item?.nickname).join(',')}
          </div>
        );
      },
    },
  },
  // 创建时间
  {
    title: $t('customer.list.createTime'),
    field: 'createdAt',
    formatter: ['formatDate', 'yyyy-MM-dd'],
  },
  {
    title: $t('sys.menu.operation'),
    minWidth: 200,
    slots: { default: 'action' },
  },
]);
export const formColumns = computed(() => [
  {
    component: 'Input',
    fieldName: 'nickname',
    label: $t('customer.list.name'),
    rules: 'required',
  },
  {
    component: 'Input',
    fieldName: 'username',
    label: $t('customer.list.bind'),
    disabled: true,
    componentProps: {
      placeholder: ' ',
    },
  },
  {
    component: 'CheckboxGroup',
    componentProps: {
      options: [
        { value: 'A', label: 'A' },
        { value: 'B', label: 'B' },
        { value: 'C', label: 'C' },
        { value: 'D', label: 'D' },
        { value: 'E', label: 'E' },
      ],
    },
    fieldName: 'checkbox',
    label: $t('customer.bind.bindagent'),
  },
  // {
  //   component: 'Input',
  //   componentProps: {
  //     clearable: true,
  //   },
  //   fieldName: 'phone',
  //   label: $t('customer.list.phone'),
  //   rules: 'required',
  // },
  // {
  //   component: 'Input',
  //   // 对应组件的参数
  //   fieldName: 'email',
  //   label: $t('customer.list.email'),
  //   rules: 'required',
  // },
  // {
  //   component: 'RadioGroup',
  //   defaultValue: '1',
  //   componentProps: {
  //     isButton: true,
  //     options: [
  //       {
  //         label: $t('sys.role.start'),
  //         value: '1',
  //       },
  //       {
  //         label: $t('sys.role.stop'),
  //         value: '0',
  //       },
  //     ],
  //   },
  //   fieldName: 'status',
  //   label: $t('sys.role.status'),
  // },
  {
    component: 'Input',
    fieldName: 'remark',
    componentProps: {
      type: 'textarea',
      rows: 4,
      maxlength: 200,
      showWordLimit: true,
    },
    label: $t('sys.role.remark'),
  },
]) as any;
